<template>
    <div class="home">
      <div class="common-layout">

        <el-container>
      <el-header>
        <Header></Header>
      </el-header>
      <el-container>
        <el-aside width="250px">
            <Nav></Nav>
        </el-aside>
        <el-main>
           <router-view></router-view>
        </el-main>
      </el-container>
    </el-container>
  </div>
    </div>
</template>

<script setup lang="ts">
   import Header from "../../components/layouts/Header.vue"
   import Nav from "../../components/layouts/Nav.vue"
   
</script>

<style lang="less" scoped>
  .home{
    color: #fff;
    text-align: center;
    width: 100%;
    height: 100%;
    background-color: #fff;
  }
  .el-header{
    height: 80px;
    background-color:#409eff;
  
  }
  .el-aside {
    background-color: #314158;
    height:   calc(100vh - 80px);
    &::-webkit-scrollbar{
      width: 0;
    }
  }
  .el-main{
    color: #000;
  }
  
</style>